<template>
  <section id="container">
    <myhead></myhead>
    <mymenu ref="mymenu"></mymenu>
    <section v-if="isadduser" id="main-content">
      <section class="wrapper">
        <div class="row">
          <div class="col-lg-12 main-chart">
            <div class="border-head mm">
              <h3>用户管理
                <button class="btn btn-small btn-theme04 btn-head"  @click="changePassWord">修改密码</button>
                <!-- <button class="btn btn-small btn-theme04 btn-reflash"  @click="roleManager">角色管理</button> -->
              </h3>
            </div>
          </div>
        </div>
        <div class="row mb">
          <div class="content-panel mypanel">
            <div class="adv-table">
              <div id="hidden-table-info_wrapper" class="dataTables_wrapper form-inline" role="grid">
                <table  class="display table table-bordered dataTable">
                  <thead>
                    <tr role="row">
                      <th class="sorting_asc">用户名</th>
                      <th class="sorting">角色</th>
                      <th class="sorting">状态</th>
                      <th class="sorting">操作</th>
                    </tr>
                  </thead>
                  <tr class="gradeA odd" v-if="userlist==''">
                    <td colspan="9"><div class="noinfo"><p>没有其他用户信息!</p></div></td>
                  </tr>
                  <tbody role="alert" aria-live="polite" aria-relevant="all">
                    <template v-for="user in userlist">
                      <tr class="gradeA odd">
                        <td>{{user.userName}}</td>
                        <td>
                          <template v-for="role in user.allRoles">
                            {{role.description}}
                          </template>
                        </td>
                        <td v-if="user.locked==1">锁定</td>
                        <td v-else>正常</td>
                        <td>
                          <button class="btn btn-danger btn-xs userchange"  v-if="user.locked==1"@click="readyControl(user.id,0,'解锁')">解锁</button>
                          <button class="btn btn-success btn-xs userchange"  v-else @click="readyControl(user.id,1,'锁定')">锁定</button>
                          <button class="btn btn-info btn-xs userchange"  @click="readyChangeRole(user.id)">变更角色</button>
                        </td>
                      </tr>
                    </template>
                  </tbody>
                </table>
                <div class="row">
                  <div class="col-lg-12">
                      <button class="btn btn-small btn-theme04 btn-head rightbtn" v-bind:disabled="isReflash" @click="adduser(false)">添加</button>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
    </section>
    <adduser v-if="!isadduser" @isadd="adduser"></adduser>
  </section>
</template>

<script>
  import myhead from './myhead.vue'
  import mymenu from './mymenu.vue'
  import adduser from './adduser.vue'
  import apiConfig from '../../config/api.config'
  export default {
    name: 'user',
    data () {
      return {
        userlist:[],
        isReflash:false,
        isadduser:true,
      }
    },
    components: {
      myhead,mymenu,adduser
    },
    mounted () {
      this.userInformation()
      this.setMenu()
    },
    methods:{
      setMenu(){
        this.$refs.mymenu.setMenu('user')
      },
      adduser:function(msg){
        if(msg === true){
          this.userInformation();
        }
        this.isadduser = msg
      },
      userInformation(){
        var that = this
        var token = sessionStorage.getItem('shiro-token')
        if (!token) {
          this.$router.push({path: '/'})
          return true
        }else{
          var instance = this.$axios.create({
            headers: {'Authorization':token}
          });
          instance.post('ganzi-server/user/getUser')
          .then(function (response) {
            if(response.data.code == '200'){
              if(response.data.data && response.data.data.length>0 ){
                that.userlist = response.data.data
              }
            }else{
              that.$options.methods.showToast(response.data.msg)
            }
          })
          .catch(function (error) {
            if(error.response && error.response.data.status == 4001){
              sessionStorage.clear();
              that.$router.push({path: '/'})
            }else if(error.response && error.response.data.status == 4002){
              sessionStorage.clear();
              that.$options.methods.showToast('您的账号在其他地方登录,如非本人操作，请立即修改密码！')
              that.$router.push({path: '/'})
            }else{
              that.$options.methods.showToast('系统异常!')
            }
          });
        }
      },
      changePassWord:function(){
        var that = this
        var content = '<div id="setPassWord"><input  class=" form-control" type="text" required="" autofocus><div>'
        $.confirm({
          title: '请输入新密码:',
          content: content,
          confirmButton: '更改',
          cancelButton: '取消',
          confirmButtonClass: 'btn-warning',
          cancelButtonClass: 'btn-success',
          backgroundDismiss: false,
          columnClass: 'col-md-4 col-md-offset-4',
          confirm: function(){
            var temp = $("#setPassWord input").val()
            if(temp && temp.length>5){
              that.passWord(temp)
            }else{
              that.showToast("请输入大于五位的新密码!")
            }
          },
          cancel: function(){
          }
        })
      },
      passWord(pass){
        var that = this
        var token = sessionStorage.getItem('shiro-token')
        if (!token) {
          this.$router.push({path: '/'})
          return true
        }else{
          var instance = this.$axios.create({
            headers: {'Authorization':token}
          });
          instance.post('ganzi-server/user/changePassWord',{
            password:pass
          })
          .then(function (response) {
            if(response.data.code == '200'){
              sessionStorage.clear();
              that.$router.push({path: '/'})
              that.showToast("密码修改成功！")
            }else{
              that.showToast(response.data.msg)
            }
          })
          .catch(function (error) {
            if(error.response && error.response.data.status == 4001){
              sessionStorage.clear();
              that.$router.push({path: '/'})
            }else if(error.response && error.response.data.status == 4002){
              sessionStorage.clear();
              that.$options.methods.showToast('您的账号在其他地方登录,如非本人操作，请立即修改密码！')
              that.$router.push({path: '/'})
            }else{
              that.$options.methods.showToast('系统异常!')
            }
          });
        }
      },
      readyControl(id,v,msg){
        var that = this
        $.confirm({
          title: '提示',
          content: '确定将该用户'+msg+'？',
          confirmButton: '确定',
          cancelButton: '取消',
          confirmButtonClass: 'btn-warning',
          cancelButtonClass: 'btn-success',
          backgroundDismiss: false,
          columnClass: 'col-md-4 col-md-offset-4',
          confirm: function(){
            that.control(id,v)
          },
          cancel: function(){
          }
        })
      },
      control:function(id,v){
        var that = this
        var token = sessionStorage.getItem('shiro-token')
        if (!token) {
          this.$router.push({path: '/'})
          return true
        }else{
          var instance = this.$axios.create({
            headers: {'Authorization':token}
          });
          instance.post('ganzi-server/user/lockUser',{
            id:id,
            lock:v
          })
          .then(function (response) {
              that.userInformation()
              that.$options.methods.showToast(response.data.msg)
          })
          .catch(function (error) {
            if(error.response && error.response.data.status == 4001){
              sessionStorage.clear();
              that.$router.push({path: '/'})
            }else if(error.response && error.response.data.status == 4002){
              sessionStorage.clear();
              that.$options.methods.showToast('您的账号在其他地方登录,如非本人操作，请立即修改密码！')
              that.$router.push({path: '/'})
            }else{
              that.$options.methods.showToast('系统异常!')
            }
          });
        }
      },
      readyChangeRole(id){
        var baseurl = apiConfig.baseURL
        var that = this
        var token = sessionStorage.getItem('shiro-token')
        var win = $.confirm({
          title: '请选择角色:',
          content: function ($obj) {
             return $.ajax({
                type: "POST",
                headers: {
                    'Authorization':token
                },
                url: baseurl+'ganzi-server/user/getRoles',
                dataType: 'json',
                success: function (data) {
                  if(data.code == '200'){
                      if(data.data && data.data.length>0 ){
                        var htmls = '<div id="setRole"><select class="mycdss">'
                        for(let role of data.data){
                          htmls+='<option value='+role.id+'>'+role.description+'</option>'
                        }
                        htmls+='</select><div>'
                        $obj.contentDiv.html(htmls);
                      }else{
                        $obj.contentDiv.html('没有信息')
                      }
                  }else{
                    $obj.contentDiv.html(data.msg)
                  }
                },
                error: function (error) {
                  win.close();
                  if(error.responseJSON && error.responseJSON.status == 4001){
                    sessionStorage.clear();
                    that.$router.push({path: '/'})
                  }else if(error.responseJSON && error.responseJSON.status == 4002){
                    sessionStorage.clear();
                    that.showToast('您的账号在其他地方登录,如非本人操作，请立即修改密码！')
                    that.$router.push({path: '/'})
                  }else{
                    that.showToast('系统异常!')
                  }
                }
            });
          },
          confirmButton: '变更',
          cancelButton: '取消',
          confirmButtonClass: 'btn-warning',
          cancelButtonClass: 'btn-success',
          backgroundDismiss: false,
          columnClass: 'col-md-4 col-md-offset-4',
          confirm: function(){
            var roles = $("#setRole select").val()
            if(roles){
              that.changeRole(id,roles)
            }else{
              that.showToast("请选择角色！")
            }
          },
          cancel: function(){
          }
        })
      },
      changeRole(id,role){
        var that = this
        var token = sessionStorage.getItem('shiro-token')
        if (!token) {
          this.$router.push({path: '/'})
          return true
        }else{
          var instance = this.$axios.create({
            headers: {'Authorization':token}
          });
          instance.post('ganzi-server/user/changerole',{
            id:id,
            role:role
          })
          .then(function (response) {
            that.userInformation()
              that.$options.methods.showToast(response.data.msg)
          })
          .catch(function (error) {
            if(error.response && error.response.data.status == 4001){
              sessionStorage.clear();
              that.$router.push({path: '/'})
            }else if(error.response && error.response.data.status == 4002){
              sessionStorage.clear();
              that.$options.methods.showToast('您的账号在其他地方登录,如非本人操作，请立即修改密码！')
              that.$router.push({path: '/'})
            }else{
              that.$options.methods.showToast('系统异常!')
            }
          });
        }
      },
      showToast:function(msg){
        $.alert({
          title: '消息!',
          content: msg,
          confirmButton: '确定',
          confirmButtonClass: 'btn-warning',
          backgroundDismiss: false,
          confirm: function(){
          }
        });
      }
    }
  }
</script>

<style scoped>
  @import "../assets/css/to-do.css";
  @import "../assets/css/school.css";
</style>
